<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/register.css" />
		<link rel="stylesheet" type="text/css" href="css/common.css" />

		<style type="text/css">
			h6 {
				font-size: 17px;
				color: #222222;
				padding-left: 10px;
			}
			
			.geshi {
				padding: 10px 20px;
				color: #222222;
			}
			
			.geshi span {
				color: #007aff;
			}
			
			.small_title {
				color: #222222;
			}
			
			.imgbox p {
				color: #222222;
			}
			
			.con {
				display: flex;
				justify-content: space-around;
			}
			
			.imageup {
				width: 140px;
				height: 100px;
				margin-bottom: 20px;
				background: rgba(34, 34, 34, .1);
			}
			
			.imageup img {
				width: 100%;
				height: 100%;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">企业注册</h1>
		</header>
		<div class="mui-content" id="app">
			<div class="header">
				<h1><span class="num">③</span><span>企业申请图片上传</span></h1>
				<span class="small_title">上传图片文字需清晰可见，以下内容全部为必填项</span>
			</div>
			<div class="updata">
				<h6>上传的图片资料</h6>
				<p class="geshi">审核时间1-5日<span>(格式jpg,png,100kb以内)</span></p>
				<div class="con">
					<div class="imgbox">
						<p>营业执照照片</p>
						<img id="0" class="imageup" :src="files[0].path" alt="" />
					</div>

					<div class="imgbox">
						<p>法人身份证正面照片</p>
						<img id="1" class="imageup" :src="files[1].path" alt="" />
					</div>
				</div>

				<div class="con">
					<div class="imgbox">
						<p>法人身份证反面照片</p>
						<img id="2" class="imageup" :src="files[2].path" alt="" />
					</div>

				</div>
				<!--<ul id="files" style="text-align:left;">
					<p id="empty" style="font-size:12px;color:#C6C6C6;">无上传文件</p>
				</ul>-->

			</div>

			<div class="footer">
				<button type="button" class="mui-btn mui-btn-blue mui-btn-block" onclick="upload();">确认提交</button>
			</div>
		</div>
	</body>

</html>
<script src="js/mui.min.js"></script>
<script src="js/vue.js"></script>
<script type="text/javascript">
	mui.init()
	var app = new Vue({
		el: "#app",
		data: {
			suoyin: Number,
			files: [{
				name: "uploadkey0",
				path: 'images/imgjia.png'
			}, {
				name: "uploadkey1",
				path: 'images/imgjia.png'
			}, {
				name: "uploadkey2",
				path: 'images/imgjia.png'
			}],
		}
	})
	var p1;
	var p2;
	var p3

	function plusReady() {
		// 弹出系统选择按钮框  
		mui("body").on("tap", ".imageup", function() {
			var _this = this;
			app.suoyin = this.id;
			page.imgUp(_this);
		})
		p1 = plus.webview.getWebviewById("qiyezhuce1.html")
		p2 = plus.webview.getWebviewById("qiyezhuce2.html")
		p3 = plus.webview.getWebviewById("qiyezhuce3.html")
	}
	var page = null;
	page = {
		imgUp: function(_this) {
			var m = this;
			plus.nativeUI.actionSheet({
				cancel: "取消",
				buttons: [{
						title: "拍照"
					},
					{
						title: "从相册中选择"
					}
				]
			}, function(e) { //1 是拍照  2 从相册中选择  
				switch(e.index) {
					case 1:
						appendByCamera();
						break;
					case 2:
						appendByGallery();
						break;
				}
			});

		}
		//摄像头  
	}

	// 上传文件
	function upload() {
		if(app.files.length <= 0 || app.files[0].path === 'images/imgjia.png' || app.files[1].path === 'images/imgjia.png' || app.files[2].path === 'images/imgjia.png') {
			plus.nativeUI.alert("没有添加上传文件！");
			return;
		}

		var wt = plus.nativeUI.showWaiting('上传中..');
		var task = plus.uploader.createUpload(URL + 'meCompanyUser!register', {
				method: "POST"
			},
			function(t, status) { //上传完成
				console.log(JSON.stringify(t))
				if(status == 200 && t.state == 4) {
					plus.webview.close(p1);
					plus.webview.close(p2);
					plus.webview.close(p3);
					wt.close();
				} else {
					mui.toast("上传失败：" + status);
					wt.close();
				}
			}
		);
		task.addData("data", qu('DATA'));
		task.addData("data2", qu('DATA2'));
		for(var i = 0; i < app.files.length; i++) {
			var f = app.files[i];
			task.addFile(f.path, {
				key: 'comImg' + i
			});
		}
		task.start();
	}
	// 拍照添加文件
	function appendByCamera() {
		plus.camera.getCamera().captureImage(function(p) {
			plus.gallery.save(p, function(path) {
				appendFile(path.file);
			});
		});

	}
	// 从相册添加文件
	function appendByGallery() {
		plus.gallery.pick(function(p) {
			appendFile(p);
		});
		console.log(JSON.stringify(app.files))

	}
	// 添加文件
	var index = 1;

	function appendFile(p) {
		var fe = document.getElementById("files");
		console.log(p);
		mui('#' + app.suoyin)[0].src = p;
		app.files[app.suoyin] = {
			name: "uploadkey" + app.suoyin,
			path: p
		}

		console.log(JSON.stringify(app.files));
	}

	if(window.plus) {
		plusReady();
	} else {
		document.addEventListener("plusready", plusReady, false);
	}
</script>